<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="xuejianxinokok">
    <title>首页</title>
    <script src="/webjars/jquery/3.5.1/jquery.js"></script>
    <script type="text/javascript" src="./js/dialog.js"></script>
    <script src="/aa.js"></script>
    <link href="./css/dialog.css" type="text/css" rel="stylesheet">
</head>
<body>
<form id="searchForm">
    <table>
        <tbody>
        <tr>
            <td>省:</td>
            <td>
			<span id="aazone.zoneProvince">
				<select>
    				<option value="">请选择</option>
		    	</select>
			</span>
            </td>

            <td>市:</td>
            <td>
			<span id="aazone.zoneCity">
				<select>
    				<option value="">请选择</option>
		    	</select>
			</span>
            </td>

            <td>区/县:</td>
            <td>
			<span id="aazone.zoneCounty">
				<select>
    				<option value="">请选择</option>
		    	</select>
			</span>
            </td>
            <td>姓名:</td>
            <td>
                <input type="text" id="name" name="name" onkeyup="search()">
            </td>
            <td>id:</td>
            <td>
                <input type="text" id="id" name="id" onkeyup="search()">
            </td>

            <td>
            </td>
            <td>
                <button type="button" name="btSave" id="btSave">新增</button>
            </td>
        </tr>
        </tbody>
    </table>
</form>
<hr>
列表：
<span id="aazone.zoneUserList">
<!-- @end of zone [zoneUserList]@ --></span>
<hr>
详情：
<span id="aazone.zoneUserDetail">
<!-- @end of zone [zoneUserDetail]@ --></span>

<script type="text/javascript">
    $(function () {
        new Promise(function (resolve) {
            document.getElementById("searchForm").action = "t/userList?aazones=zoneUserList";
            ajaxAnywhere.formName = "searchForm";
            ajaxAnywhere.submitAJAX();
            ajaxAnywhere.onAfterResponseProcessing = function () {
                resolve();
            }
        }).then(function () {
            return new Promise((res) => {
                ajaxAnywhere.getAJAX('/j/getProvinceList', 'zoneProvince');
                ajaxAnywhere.onAfterResponseProcessing = function () {
                    res();
                }
            })
        }).then(function () {
            return new Promise((res) => {
                ajaxAnywhere.getAJAX('/t/getCityList', 'zoneCity');
                ajaxAnywhere.onAfterResponseProcessing = function () {
                    res();
                }
            })
        }).then(function () {
            ajaxAnywhere.getAJAX('/f/getCountyList', 'zoneCounty');
        });
    })

    $('#btSave').on('click', function () {
        dialog.show({
            url: "/j/toSave",
            data: {},
            css: {
                width: "430px",
                height: "270px",
                background: "white"
            }
        })
    })

    function changeGetCity(val) {

        new Promise(function (resolve) {
            document.getElementById("city").value = ''
            document.getElementById("county").value = ''

            this.search()
            ajaxAnywhere.onAfterResponseProcessing = function () {
                resolve();
            }
        }).then(function () {
            new Promise(function () {
                ajaxAnywhere.getAJAX('/t/getCityList/' + val, 'zoneCity');
            })
        });
    }

    function changeGetCounty(val) {
        new Promise(function (resolve) {
            document.getElementById("county").value = ''
            this.search()
            ajaxAnywhere.onAfterResponseProcessing = function () {
                resolve();
            }
        }).then(function () {
            new Promise(function () {
                ajaxAnywhere.getAJAX('/f/getCountyList/' + val, 'zoneCounty');
            })
        });
    }

    function changeGetList() {
        this.search();
    }

    function search() {
        document.getElementById("searchForm").action = "t/userList?aazones=zoneUserList";
        ajaxAnywhere.formName = "searchForm";
        ajaxAnywhere.submitAJAX();

    }

    function detail() {
        var tab = document.getElementById("userTable")
        var tr = tab.getElementsByTagName("tr")
        for (var i = 0; i < tr.length; i++) tr[i].onclick = function () {
            var id = $(this).children().eq(1).text();//所点击的第二个td内容
            ajaxAnywhere.getAJAX('/t/userDetail?id=' + id, 'zoneUserDetail');

        }
    }

    function userClose() {
        dialog.closeDialog()
    }

    function userSave() {
        let option = {}
        let json = {}
        json.id = $("input[name='saveId']").val()
        json.name = $("input[name='saveName']").val()
        let province = $("select[name='saveProvince'] option:selected");
        json.province = province.val()
        json.provinceName = province.text()
        let city = $("select[name='saveCity'] option:selected");
        json.city = city.val()
        json.cityName = city.text()
        let county = $("select[name='saveCounty'] option:selected");
        json.county = county.val()
        json.countyName = county.text()
        option.url = "/j/doSave?aaxmlrequest=true&aazones=zoneUserList"
        option.data = JSON.stringify(json)
        ajaxAnywhere.postJsonAjax(option)
        dialog.closeDialog()

    }

</script>


</body>
</html>
